<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="u" uri="/iuie-tag"%>
<%@ taglib prefix="sys" uri="/sys-tag" %>
<%@ taglib prefix="lui" tagdir="/WEB-INF/tags" %>

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>书籍模块</title>
<lui:context/>
</head>
<u:View basePath="/res-datum/book" userJS="book" userCSS="book" delayLoadJs="false" res="base64">
<body style="overflow-y:auto">
<lui:boards>
    <lui:board width="70%" boardTitle="书籍管理">
		<!-- 操作搜索栏 -->
		<form id="findBookInfoFrm" class='m-cust'>
	    <div class='t-oper-bar'>
	        <div class="m-form t-uploader">
				<form class="m-cust" method="post" action="${ctx}/datum/file/doUpload" enctype="multipart/form-data" target="uploadIFrm" id='uploadFile'>
			        <iframe id="uploadIFrm" name="uploadIFrm" style="display:none;"></iframe>
					<label class="m-btn m-primary t-upload-btn" for="xFile" onclick="BookPage.uploadBook()">上传书籍</label>
	            </form>
	        </div>
			<div class="m-form t-search">
				<!-- 搜索下面ul中的菜单 -->
				<input type="text" name='bookName' autofocus="autofocus" placeholder="搜索文件名" data-type='search' id='searchBook'><i 
					class='fa fa-search'></i>
			</div>
		</div>
		    <input name="originalName" hidden="hidden"/>
		    <u:dropListView id="dropView_oper">
                <u:dropView name="delete" template="delete" onClick="BookPage.deleteBook" title="删除"/>
                <u:dropView name="update" template="edit" onClick="BookPage.updateBook" title="修改"/>
            </u:dropListView> 
		    <u:dataSet id="bookInfoSet" idField="bookId">
	             <u:dataField display="书籍ID" name="bookId" visiable="false"/>
				 <u:dataField display="封面" name="coverFileId" width="100px" visiable="false" />
				 <u:dataField display="书籍名称" name="bookName" width="200px" align="left"/>
				 <u:dataField display="作者" name="authorName"/>
				 <u:dataField display="阅读者" name="userName"/>
				 <u:dataField display="进度" name="progress"/>
				 <u:dataField display="上传时间" name="entryDateTime" width="135px"/>
			 	 <u:dataField display="访问链接" name="urlFileId" align="left"/>
			 	 <u:dataField display="书籍类型" name="bookType" align="left"/>
			 	 <u:dataField display="注释" name="comments" align="left"/>
			 	 <u:dataField display="操作" name="oper" dropView="dropView_oper" width="50px"/>
	         </u:dataSet>
	         <!-- 删除书籍 -->
	         <lui:ajax url="${ctx }/book/bookDelete " id="bookDeleteAjax" onSuccess="BookPage.onBookDeleteSucc"/>
	          <!-- 获取文件信息列表ajax -->
	         <lui:ajax id="findBookInfoAjax" url="${ctx }/book/findByPage" formQuery="#findBookInfoFrm" formSubmit="true"/>
	         <lui:datatable id="bookInfoDatatable" ajax="findBookInfoAjax" sortable="true" pagination="fileInfoPagination" dataset="bookInfoSet"
	             checkable="false" multiple="false" cutLine="true"  tip="true" onItemClick="BookPage.showBookDetail"/>
	         <lui:pagination datatable="bookInfoDatatable" id="fileInfoPagination" pageSize="15" pageChoice="15" showPageChoice="false"/>
		</form> 
	</lui:board>
	<lui:board width="30%" boardTitle="书籍详情">
	    <div class="row">
	        <div class="col-sm-12 col-md-12">
	            <div class="thumbnail">
	                 <img id ="bookImageShow" src="${ctx }/${resourceVersion}/res-datum/book/images/default.jpg" alt="书籍封面">
	                  <div class="caption">
	                       <h3 id="bookName"></h3>
	                       <p id="comments"></p>
	                       <p id="progress" style="color:red"></p>
	                  </div>
	                  <div id="caption"></div>
	            </div>
	        </div>
	    </div>
	</lui:board>
</lui:boards>
</body>
</u:View>
</html>